* {
  margin: 0;
  padding: 0;
}
li {
  list-style: none;
}
html,
body {
  height: 100%;
}
.contant {
  text-align: center;
  height: 60px;
  width: 320px;
}
.booton {
  fill: transparent;
  stroke-dasharray: 140 540;
  stroke-dashoffset: -474;
  stroke-width: 8px;
  stroke: url('#gradient');
}
.text {
  color: #000;
  font-family: 'Lato';
  font-size: 22px;
  letter-spacing: 8px;
  line-height: 32px;
  position: relative;
  top: -48px;
}
@keyframes draw {
  0% {
    stroke-dasharray: 140 540;
    stroke-dashoffset: -474;
    stroke-width: 8px;
  }
  100% {
    stroke-dasharray: 760;
    stroke-dashoffset: 0;
    stroke-width: 2px;
  }
}
.contant:hover .booton {
  -webkit-animation: 0.5s draw linear forwards;
  animation: 0.5s draw linear forwards;
}
.page-foot-column {
  order: 0;
  flex: 1 1 auto;
  align-self: auto;
  padding: 1em;
  font-family: Lato;
}
a {
  color: inherit;
  text-decoration: none;
}
a:hover {
  text-decoration: none;
}
